<template>
    <div>
      <ul class="mui-table-view">
        <li class="mui-table-view-cell mui-media" v-for="item in newslist" :key="item.id">
          <router-link :to="'/home/newsinfo/' + item.id">
            <img class="mui-media-object mui-pull-left" :src="item.image_url">
            <div class="mui-media-body">
              <h4>{{ item.title }}</h4>
              <p class='mui-ellipsis'>
                <span>发表时间:{{ item.time | dateFormat}}</span>
                <span>点击:{{ item.like }}次</span>
              </p>
            </div>
          </router-link>
        </li>
      </ul>
    </div>
</template>

<script>
  import { Toast } from 'mint-ui'
    export default {
        data() {
          return {
            newslist: []
          }
        },
        created(){
          this.getNewsList()
      },
        methods: {
          getNewsList(){
            this.$http.get('http://115.28.2.132:9876/news_list').then(result=> {
              if(result.body.status === "success"){
                this.newslist = result.body.data;
                // console.log(this.newslist)
              }else{
                Toast('获取新闻列表失败')
              }
            })
          }
        }
    }
</script>

<style scoped>
  .mui-ellipsis {
    font-size: 12px;
    color: #226aff;
    display: flex;
    justify-content: space-between;
  }
</style>
